<template>
	<view>
		<u-popup v-model="show" mode="bottom" border-radius="30" :safe-area-inset-bottom="true" z-index="9999" @close="cancel">
			<div class="options flex" v-show="!['details','edetails'].includes(flag)">
				<!-- <div class="option share" @click="share">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/share.png"></u-image>
					</div>
					分享
				</div> -->
				<div class="option link" @click="copyLink">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/link.png"></u-image>
					</div>
					复制链接
				</div>
				<div class="option info" @click="copyInfo">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/copy.png"></u-image>
					</div>
					复制信息
				</div>
				<div class="option source" @click="view">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/browse.png"></u-image>
					</div>
					查看原文
				</div>
				<div class="option warn" @click="warn" v-show="flag != 'warnList'">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/remind.png"></u-image>
					</div>
					加入预警
				</div>
				<div class="option read" @click="read">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/readed.png"></u-image>
					</div>
					标记已读
				</div>
				<div class="option del" @click="del" v-if="own.includes(56)">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/delete.png"></u-image>
					</div>
					删除
				</div>
				<div class="option warnword" @click="excword">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/excludedword.png"></u-image>
					</div>
					排除词
				</div>
				<div class="option warnword" @click="warnword">
					<div class="icon-box flex">
						<u-image class="icon" width="50rpx" height="50rpx" src="./../static/warnword.png"></u-image>
					</div>
					预警词
				</div>
			</div>
			<div class="sentiments flex">
				<div class="sentiment sentiment-1" @click="sentiment(1)">正</div>
				<div class="sentiment sentiment-2" @click="sentiment(2)">中</div>
				<div class="sentiment sentiment-3" @click="sentiment(3)">负</div>
			</div>
			<div class="btn" @click="cancel">取消</div>
		</u-popup>
		<u-toast ref="uToast" />
		
		<!-- 预警弹窗 -->
		<AddWarn :id="row.id" :subjectId="row.subject_id" :isWarn="isWarn" :text="warnText" :text_tmp="warnText_tmp" @close="closeAddWarn"></AddWarn>
		<!-- 删除弹窗 -->
		<DelArticle :row="row" :isDel="isDel" @close="isDel=false"></DelArticle>
		<!-- 排除词弹窗 -->
		<ExcWrod :row="row" :isExcWord="isExcWord" @close="excClose"></ExcWrod>
		<!-- 预警词弹窗 -->
		<WarnWrod :row="row" :isWarnWord="isWarnWord" @close="warnClose"></WarnWrod>
	</view>
</template>

<script>
import { addAlert, toRead, sentimentAttr, subjectIncluded, articleDel } from "@/api/subject.js";
import { articleRead, eSentimentAttr, eArticleDel } from "@/api/event.js";
import AddWarn from "@/components/addWarn.vue";
import DelArticle from "@/components/delArticle.vue";
import ExcWrod from "@/components/excWrod.vue";
import WarnWrod from "@/components/warnWrod.vue";
import UniShare from 'uni_modules/uni-share/js_sdk/uni-share.js';
const uniShare = new UniShare();

export default {
	components: {
		AddWarn, DelArticle, WarnWrod, ExcWrod
	},
	props: {
		row: {
			type: Object,
			default: function() {
				return {};
			}
		},
		flag: {
			type: String,
			default: "",
		},
	},
	data() {
		return {
			own: uni.getStorageSync("own"),
			isWarn: false,
			warnText: "",
			warnText_tmp: "",
			isDel: false,
			isWarnWord: false,
			isExcWord: false
		}
	},
	computed: {
		show: {
			get() {
				return this.$store.state.isAction;
			},
			set(value) {
				this.$store.state.isAction = value;
			}
		},
	},
	methods: {
		share() {
			this.cancel();
			// #ifdef APP-PLUS
			uniShare.show({
				content: {
					type: 0,
					href: 'https://uniapp.dcloud.io/',
					title: '标题',
					summary: '描述',
					imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
				},
				menus: [
					{
						"img": "/static/app-plus/sharemenu/wechatfriend.png",
						"text": "微信好友",
						"share": {
							"provider": "weixin",
							"scene": "WXSceneSession"
						}
					},
					{
						"img": "/static/app-plus/sharemenu/wechatmoments.png",
						"text": "微信朋友圈",
						"share": {
								"provider": "weixin",
								"scene": "WXSceneTimeline"
						}
					},
					{
						"img": "/static/app-plus/sharemenu/weibo.png",
						"text": "微博",
						"share": {
							"provider": "sinaweibo"
						}
					},
					{
						"img": "/static/app-plus/sharemenu/qq.png",
						"text": "QQ",
						"share": {
							"provider": "qq"
						}
					},
				],
				cancelText: "取消分享",
			}, e => {
					console.log(uniShare.isShow);
					console.log(e);
			})
			// #endif
		},
		copyLink() {
			this.cancel();
			uni.setClipboardData({
				data: this.row.url,
				showToast: false,
				success: ()=>{
					this.$refs.uToast.show({
						title: "复制链接成功",
						type: "success",
					});
				}
			});
		},
		copyInfo() {
			this.cancel();
			let {fields,list} = uni.getStorageSync("copyTemplate");
			let keys = list.map(item=>item.title);
			let arr = [];
			fields.map(item=>{
				if(keys.includes(item.title)){
					if(item.title == "标题"){
						arr.push(item.title+"：" + this.row.title || this.row.summary.slice(0,30));
					}else if(item.title == "时间"){
						arr.push(item.title+"：" + $u.timeFormat(this.row[item.key]*1000, "yyyy-mm-dd hh:MM"));
					}else if(item.title == "倾向性"){
						arr.push(item.title+"：" + (this.row.sentiment_attr==1?"正面":(this.row.verified_type==2?"中性":"负面")));
					}else if(item.title == "涉及关键词"){
						arr.push(item.title+"：" + this.row[item.key].join(","));
					}else if(item.title == "涉事省份"){
						arr.push(item.title+"：" + this.row?.ip_region[0] || this.row?.province);
					}else if(item.title == "认证类型"){
						arr.push(item.title+"：" + (this.row.verified_type==-1?"普通用户":(this.row.verified_type==0?"个人认证":"机构认证")));
					}else{
						arr.push(item.title+"：" + (this.row[item.key] ? this.row[item.key] : ""));
					}
				}
			});
			uni.setClipboardData({
				data: arr.join("\n"),
				showToast: false,
				success: ()=>{
					this.$refs.uToast.show({
						title: "复制信息成功",
						type: "success",
					});
				}
			});
		},
		view() {
			this.cancel();
			// #ifdef APP-PLUS
			this.$u.route("/pages/webview/webview",{
				url: encodeURIComponent(this.row.url),
			});
			// #endif
			
			// #ifdef H5
			window.open(this.row.url);
			// #endif
		},
		warn() {
			this.isWarn = true;
			let data = `${this.$u.timeFormat(this.row.publish_time*1000, "yyyy-mm-dd hh:MM")}，[${this.row.subject_title}]出现预警信息，标题为:${this.row.title}`;
			this.warnText = data;
			this.warnText_tmp = data;
		},
		read() {
			this.cancel();
			if(this.flag == "edetails"){
				articleRead({ids: [this.row.id],event_id:this.row.eid}).then(({code})=>{
					if(code == 200){
						uni.$emit("markRead",[this.row.id]);
						this.$refs.uToast.show({
							title: "标记已读成功",
							type: "success",
						});
					}
				});
			}else{
				toRead({ids: [this.row.id]}).then(({code})=>{
					if(code == 200){
						uni.$emit("markRead",[this.row.id]);
						this.$refs.uToast.show({
							title: "标记已读成功",
							type: "success",
						});
					}
				});
			}
		},
		del() {
			this.cancel();
			this.isDel = true;
		},
		excword() {
			this.isExcWord = true;
			this.cancel();
		},
		warnword() {
			this.isWarnWord = true;
			this.cancel();
		},
		cancel() {
			this.$store.state.isAction = false;
			setTimeout(()=>{
				if(!this.isWarnWord){
					uni.showTabBar();
				}
			});
		},
		sentiment(val) {
			if(this.flag == "edetails"){
				eSentimentAttr({ids: [this.row.id],attr: val,event_id:this.row.eid}).then(({code})=>{
					if(code == 200){
						this.cancel();
						uni.$emit("markSentiment", {ids: [this.row.id], val: val});
						this.$refs.uToast.show({
							title: "倾向性修改成功",
							type: "success",
						});
					}
				});
			}else{
				sentimentAttr({ids: [this.row.id],attr: val}).then(({code})=>{
					if(code == 200){
						this.cancel();
						uni.$emit("markSentiment", {ids: [this.row.id], val: val});
						this.$refs.uToast.show({
							title: "倾向性修改成功",
							type: "success",
						});
					}
				});
			}
		},
		excClose() {
			this.isExcWord = false;
			if(getCurrentPages().pop().route == "pages/index/index"){
				uni.showTabBar();
			}
		},
		warnClose() {
			this.isWarnWord = false;
			if(getCurrentPages().pop().route == "pages/index/index"){
				uni.showTabBar();
			}
		},
		closeAddWarn() {
			this.cancel();
			this.isWarn = false;
		}
	}
}
</script>

<style lang="scss" scoped>
.options{
	flex-wrap: wrap;
	margin-top: 60rpx;
	padding: 0 20rpx;
	margin-bottom: 30rpx;
	
	.option{
		width: 120rpx;
		text-align: center;
		margin-bottom: 20rpx;
		color: #666;
		font-size: 26rpx;
		margin: 12rpx;
	}
}
.sentiments{
	margin: 0 20rpx;
	padding: 40rpx 0;
	border-top: 2rpx solid #eee;
	.sentiment{
		width: 100rpx;
		height: 100rpx;
		text-align: center;
		line-height: 100rpx;
		border-radius: 50%;
		font-size: 32rpx;
		font-weight: bold;
		margin-right: 50rpx;
	}
	.sentiment-1{
		color: #3477FF;
		border: 2rpx solid #3477FF;
	}
	.sentiment-2{
		color: #F8B551;
		border: 2rpx solid #F8B551;
	}
	.sentiment-3{
		color: #E60012;
		border: 2rpx solid #E60012;
	}
}
.btn{
	border-top: 2rpx solid #eee;
	height: 88rpx;
	line-height: 88rpx;
	text-align: center;
	cursor: pointer;
	font-size: 32rpx;
	
	&:active{
		opacity: 0.9;
	}
}
.icon-box{
	width: 80rpx;
	height: 80rpx;
	padding: 15rpx;
	border: 1rpx solid #999;
	border-radius: 50%;
	justify-content: center;
	align-items: center;
	margin: auto;
	margin-bottom: 10rpx;
}
.loading{
	display: block;
	margin: auto;
	margin-top: 10rpx;
}
</style>